<template>
  <div class="main_box">
    <div class="add_wrap">
      <div class="tit">
        <h2>基础信息</h2>
        <el-button
          plain
          size="small"
          type="success"
          icon="fa fa-mail-forward"
          @click="returnList"
        >
          返 回</el-button
        >
      </div>
      <el-form
        :model="doctorForm"
        ref="doctorForm"
        label-width="200px"
        :rules="roleRules"
      >
        <el-row>
          <!-- 医检 / 医院 二选一 -->
          <!-- <el-form-item label="医生类型" prop="doctorType">
            <el-radio-group
              v-model="doctorForm.doctorType"
              @change="handleChangeDoctorType()"
              :disabled="doctorTypeDisable"
            >
              <el-radio :label="1">医院</el-radio>
              <el-radio :label="2">医检</el-radio>
            </el-radio-group>
          </el-form-item> -->
          <HospitalSelect
            @hospitalId="getHospitalId"
            :id="doctorForm.hospitalId"
          ></HospitalSelect>
          <!-- <InstitutionSelect
            @institutionId="getInstitutionId"
            :id="doctorForm.institutionId"
            v-if="doctorForm.doctorType === 2"
          ></InstitutionSelect> -->

          <!-- :institution-id="doctorForm.institutionId" -->
          <div style="width: 105%">
            <OfficeSelect
              @officeId="getOfficeId"
              :hospital-id="doctorForm.hospitalId"

              :id="doctorForm.officeId"
            ></OfficeSelect>
          </div>

          <el-form-item label="医生姓名" prop="doctorName">
            <el-input v-model="doctorForm.doctorName" @keydown.native="keydown($event)"></el-input>
          </el-form-item>
          <el-form-item label="医生性别" prop="doctorSex">
            <el-radio-group v-model="doctorForm.doctorSex">
              <el-radio :label="1">男</el-radio>
              <el-radio :label="2">女</el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="医生职称" prop="doctorTitle">
            <el-input v-model="doctorForm.doctorTitle" @keydown.native="keydown($event)"></el-input>
          </el-form-item>
          <el-form-item label="医生电话" prop="doctorPhone">
            <el-input
              type="number"
              @change="changeTel"
              v-model="doctorForm.doctorPhone"
            ></el-input>
          </el-form-item>
          <el-form-item label="医生邮箱" prop="doctorEmail">
            <el-input
              @change="changeEmail"
              v-model="doctorForm.doctorEmail"
            ></el-input>
          </el-form-item>
          <el-form-item label="医生地址" prop="doctorAddress">
            <el-input v-model="doctorForm.doctorAddress"></el-input>
          </el-form-item>
          <el-form-item label="第三方医生id" prop="thirdDoctorId">
            <el-input v-model="doctorForm.thirdDoctorId"></el-input>
          </el-form-item>
          <!-- <el-form-item label="开启结果提醒" prop="isRemind">
            <el-switch
              v-model="doctorForm.isRemind"
              active-color="#13ce66"
              active-value="1"
              inactive-value="0"
            ></el-switch>
          </el-form-item> -->
          <el-form-item label="备注" prop="remark">
            <el-input v-model="doctorForm.remark"></el-input>
          </el-form-item>
        </el-row>
        <el-row>
          <el-form-item>
            <el-button
              plain
              type="primary"
              :disabled="disabledBtn"
              @click="sureDoctorClick"
              >保 存</el-button
            >
            <el-button @click="returnList">取 消</el-button>
          </el-form-item>
        </el-row>
      </el-form>
    </div>
  </div>
</template>

<script>
import HospitalSelect from "@/components/HospitalSelect";
// import InstitutionSelect from "@/components/InstitutionSelect";
import OfficeSelect from "@/components/OfficeSelect";
import DoctorApi from "@/api/institution/doctor";
import * as message from "@/constants/message";
export default {
  data() {
    return {
      projectIdsLimit: 10,
      loadingIns: false,
      // doctorTypeDisable: false,
      doctorForm: {
        doctorId: "",
        doctorName: "",
        doctorTitle: "",
        doctorImageUrl: "",
        doctorSex: "",
        hospitalId: null,
        thirdDoctorId:"",
        // institutionId: null,
        officeId: null,
        doctorPhone: "",
        doctorEmail: "",
        // isRemind: "0",
        doctorAddress: "",
        remark: "",
        doctorType: 1,
      },
      disabledBtn: false,
      roleRules: {
        hospitalId: [
          {
            required: true,
            message: "请选择医院",
            trigger: "blur",
          },
        ],
        doctorName: [
          {
            required: true,
            // validator: validators.doctorName,
            message: "请输入医生姓名",
            trigger: "blur",
          },
        ],
        thirdDoctorId:[
          {required:true,message:"请输入第三方医生id",trigger:"blur"}
        ],
        doctorTitle: [
          {
            required: true,
            message: "请输入医生职称",
            trigger: "blur",
          },
        ],
        doctorSex: [
          {
            required: true,
            message: "请选择医生性别",
            trigger: "blur",
          },
        ],
      },
      // roleRules2: {
      //   institutionId: [
      //     {
      //       required: true,
      //       message: "请选择医检",
      //       trigger: "blur",
      //     },
      //   ],
      //   doctorName: [
      //     {
      //       required: true,
      //       // validator: validators.doctorName,
      //       message: "请输入医生姓名",
      //       trigger: "blur",
      //     },
      //   ],
      //   doctorTitle: [
      //     {
      //       required: true,
      //       message: "请输入医生职称",
      //       trigger: "blur",
      //     },
      //   ],
      // },
    };
  },
  components: {
    HospitalSelect,
    // InstitutionSelect,
    OfficeSelect,
  },
  methods: {
    init() {
      if (this.$route.query.id) {
        this.getData();
      }
    },
    keydown(e) {
      if (e.keyCode == 32) {
        e.returnValue = false;
      }
    },
    getData() {
      let _this = this;
      DoctorApi.getDoctor({ doctorId: _this.$route.query.id }).then((res) => {
        _this.$Utils.bindingBean(_this.doctorForm, res.data);
        if (res.data.hospitalId) {
          _this.doctorForm.hospitalId = parseInt(res.data.hospitalId);
          // _this.doctorForm.doctorType = 1;
          // _this.doctorTypeDisable = true;
        }
        // if (res.data.institutionId) {
        //   _this.doctorForm.institutionId = parseInt(res.data.institutionId);
        //   _this.doctorForm.doctorType = 2;
        //   _this.doctorTypeDisable = true;
        // }
        if (res.data.officeId) {
          _this.doctorForm.officeId = parseInt(res.data.officeId);
        }
        // if (res.data.isRemind) {
        //   _this.doctorForm.isRemind = String(res.data.isRemind);
        // }
        _this.doctorForm.doctorSex = parseInt(res.data.doctorSex);
      });
    },
    changeTel(val) {
      // 联系人手机号号码 校验合法性
      if (this.$Utils.isEmptyObject(val)) {
        this.disabledBtn = false;
      } else {
        if (this.$Utils.isMobile(val)) {
          this.disabledBtn = false;
        } else {
          this.$Utils.messageError("手机号码格式错误");
          this.disabledBtn = true;
        }
      }
      // console.log(val)
      // console.log(this.$Utils.isMobile(val))
    },
    changeEmail(val) {
      // 联系人手机号号码 校验合法性
      if (this.$Utils.isEmptyObject(val)) {
        this.disabledBtn = false;
      } else {
        if (this.$Utils.isEmail(val)) {
          this.disabledBtn = false;
        } else {
          this.$Utils.messageError("邮箱格式错误");
          this.disabledBtn = true;
        }
      }
    },
    sureDoctorClick() {
      this.$refs.doctorForm.validate((valid) => {
        if (valid) {
          this.$confirm(
            message.MSG_CONFIRM_SAVE_ALTER,
            message.TITLE_PROMPT,
            {}
          ).then(() => {
            if (this.doctorForm.doctorId) {
              this.editDoctor();
            } else {
              this.addDoctor();
            }
          });
        }
      });
    },
    getHospitalId(val) {
      this.doctorForm.hospitalId = val;
      this.doctorForm.officeId = null;
    },
    // getInstitutionId(val) {
    //   this.doctorForm.institutionId = val;
    //   this.doctorForm.officeId = null;
    // },
    getOfficeId(val) {
      this.doctorForm.officeId = val;
    },
    handleChangeDoctorType() {
      this.doctorForm.institutionId = null;
      this.doctorForm.officeId = null;
    },
    addDoctor() {
      let _this = this;
      let doctorFormData = {
        doctorName: _this.doctorForm.doctorName,
        doctorTitle: _this.doctorForm.doctorTitle,
        // institutionId: _this.doctorForm.institutionId,
        hospitalId: _this.doctorForm.hospitalId,
        officeId: _this.doctorForm.officeId,
        doctorImageUrl: _this.doctorForm.doctorImageUrl,
        doctorSex: _this.doctorForm.doctorSex,
        doctorPhone: _this.doctorForm.doctorPhone,
        doctorEmail: _this.doctorForm.doctorEmail,
        doctorAddress: _this.doctorForm.doctorAddress,
        thirdDoctorId:_this.doctorForm.thirdDoctorId,
        remark: _this.doctorForm.remark,
        // isRemind: parseInt(_this.doctorForm.isRemind),
      };
      DoctorApi.addDoctor(doctorFormData).then((data) => {
        this.$Utils.notifySuccess();
        this.returnList();
      });
    },
    editDoctor() {
      let _this = this;
      let doctorFormData = {
        doctorId: _this.doctorForm.doctorId,
        doctorName: _this.doctorForm.doctorName,
        doctorTitle: _this.doctorForm.doctorTitle,
        // institutionId: _this.doctorForm.institutionId,
        hospitalId: _this.doctorForm.hospitalId,
        officeId: _this.doctorForm.officeId,
        doctorImageUrl: _this.doctorForm.doctorImageUrl,
        doctorSex: _this.doctorForm.doctorSex,
        doctorPhone: _this.doctorForm.doctorPhone,
        doctorEmail: _this.doctorForm.doctorEmail,
        // isRemind: parseInt(_this.doctorForm.isRemind),
        doctorAddress: _this.doctorForm.doctorAddress,
        thirdDoctorId:_this.doctorForm.thirdDoctorId,
        remark: _this.doctorForm.remark,
      };
      DoctorApi.editDoctor(doctorFormData).then((data) => {
        this.$Utils.notifySuccess();
        this.returnList();
      });
    },
    removeChildren(regions) {
      for (let i = 0, len = regions.length; i < len; i++) {
        if (regions[i].children.length === 0) {
          delete regions[i].children;
        } else {
          this.removeChildren(regions[i].children);
        }
      }
    },
    returnList() {
      this.$store.dispatch("delView", this.$route);
      this.$router.push({ path: "/institu/doctorManagement" });
    },
  },
  mounted() {
    this.init();
  },
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/views/add.scss";
</style>
<style scoped>
.add_wrap {
  padding-top: 10px;
  padding-left: 23px;
}
.main_box {
  padding: 10px;
}
</style>
